<template>
  <div class="box">
    <div>
    <span>账号：</span>
    <input type="text" v-model="ztext" />
    <span>账号：</span>
    <input type="text" v-model="ptext" />
    <button @click="yan">登录</button>
    </div>
    <div class="top">
     <button @click="$router.go(-1)">返回上一个页面</button>
        <button @click="$router.back()">返回上一个页面</button>
    </div>
  </div>
</template>

<script>
export default {
  name: "HelloWorld",
  data() {
    return {
      school: { name: "admin", password: "123" },
      ztext: "",
      ptext: "",
    };
  },
  methods: {
    yan() {
      if (
        this.ztext == this.school.name &&
        this.ptext == this.school.password
      ) {
        this.$router.push("/about");
        console.log("登录成功");
      } else {
        alert("账号密码错误");
      }
    },
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.box {
  width: 200px;
  margin: auto;
  >div:nth-of-type(1){

    > input {
      margin-bottom: 20px;
    }
    > button {
      width: 100px;
    }
  }
}
</style>
